<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
<head>
    <title>Luxury Hotel Booking Widget Flat Responsive Widget Template</title>

    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta name="keywords" content=""/>
    <style type="text/css">
        textarea {
            display: block;
            box-sizing: padding-box;
            overflow: hidden;
            padding: 10px;
            /*width: 250px;*/
            font-size: 14px;
            margin: 50px auto;
            border-radius: 8px;
            border: 6px solid #567;
            width: 100%;
            background: white;
        }
    </style>
    <script type="application/x-javascript"> addEventListener("load", function () {
        setTimeout(hideURLbar, 0);
    }, false);

    function hideURLbar() {
        window.scrollTo(0, 1);
    } </script>
    <link href='http://fonts.googleapis.com/css?family=Yanone+Kaffeesatz:400,700' rel='stylesheet' type='text/css'>
    <link href='http://fonts.googleapis.com/css?family=Montserrat:700,400' rel='stylesheet' type='text/css'>
    <link href="http://localhost:8080/SingleBook/css/style.css" rel="stylesheet" type="text/css" media="all">
    <link href="http://localhost:8080/SingleBook/css/bootstrap.css" rel='stylesheet' type='text/css' media="all">
    <script src="http://localhost:8080/SingleBook/js/jquery.min.js"></script>
    <script type="text/javascript" src="http://localhost:8080/SingleBook/js/move-top.js"></script>
    <script type="text/javascript" src="http://localhost:8080/SingleBook/js/easing.js"></script>
    <script type="text/javascript">
        jQuery(document).ready(function ($) {
            $(".scroll").click(function (event) {
                event.preventDefault();
                $('html,body').animate({scrollTop: $(this.hash).offset().top}, 1000);
            });
        });
    </script>
</head>
<body onload="load();">
<form th:action="@{/users/addRoom}"  method="post" enctype="multipart/form-data">
    <div class="banner-top">
        <h2>添加房型</h2>
        <div class="banner-bottom">
            <div class="bnr-one">
                <div class="bnr-left">
                    <p>房间类型</p>
                    <!--<span id="price1" style="display:none" th:text="${roomPrice}"></span>-->
                </div>
                <div class="bnr-right">
                    <input id="roomType" type="text" name="roomType"/>

                </div>
                <div class="clearfix"></div>
            </div>
            <div class="bnr-one">
                <div class="bnr-left">
                    <p>房间价格</p>
                    <!--<span id="price1" style="display:none" th:text="${roomPrice}"></span>-->
                </div>
                <div class="bnr-right">
                    <input id="roomPrice" type="text" name="roomPrice"/>

                </div>
                <div class="clearfix"></div>
            </div>
            <div class="bnr-one">
                <div class="bnr-left">
                    <p>床型</p>
                    <!--<span id="price1" style="display:none" th:text="${roomPrice}"></span>-->
                </div>
                <div class="bnr-right">
                    <input id="roomBed" type="text" name="roomBed"/>

                </div>
                <div class="clearfix"></div>
            </div>
            <div class="bnr-one">
                <div class="bnr-left">
                    <p>照片</p>
                    <!--<span id="price1" style="display:none" th:text="${roomPrice}"></span>-->
                </div>
                <div class="bnr-right">
                    <!--<img src="" class="bg">-->
                    <input id="roomImg" type="file" name="roomImg" />
                </div>
                <div class="clearfix"></div>
            </div>
            <div class="bnr-one">
                <div class="bnr-left">
                    <p>描述</p>
                    <!--<span id="price1" style="display:none" th:text="${roomPrice}"></span>-->
                </div>
                <div class="bnr-right">
                    <textarea id="textarea" name="roomFaci"  ></textarea>
                    <!--<input id="price" type="text" name="hotleDec"/>-->
                </div>
                <div class="clearfix"></div>
            </div>

            <div class="bnr-one">
                <div class="bnr-left">
                    <p>房间数量</p>
                    <!--<span id="price1" style="display:none" th:text="${roomPrice}"></span>-->
                </div>
                <div class="bnr-right">
                    <input id="roomNum" type="text" name="roomNum" />
                    <!--<input id="price" type="text" name="hotleDec"/>-->
                </div>
                <div class="clearfix"></div>
            </div>
            <div class="clearfix"></div>
        </div>
        <div class="bnr-btn">

            <input type="submit" value="添加" style="margin-left:30%">

        </div>

    </div>

    <!---start-date-piker---->
    <link rel="stylesheet" href="http://localhost:8080/SingleBook/css/jquery-ui.css"/>
    <script src="http://localhost:8080/SingleBook/js/jquery-ui.js"></script>
    <script>
        window.onload=function (ev) {
            var textarea=document.getElementById('textarea');
//设置高度
            textarea.style.height = textarea.scrollHeight + 'px';
        }
    </script>
    <script>
        function timer() {
            // alert(new Date(document.getElementById('datepicker1').value));
            var ts = new Date(document.getElementById('datepicker1').value) - new Date(document.getElementById('datepicker').value);
            // var ts = (new Date(2014, 9, 1, 0, 0, 0)) - (new Date());//计算bai剩余du的毫秒数      
            // alert(ts);
            var dd = parseInt(ts / 1000 / 60 / 60 / 24, 10);//计算剩余的天数      
            // var hh = parseInt(ts / 1000 / 60 / 60 % 24, 10);//计算剩余的小时数      
            // var mm = parseInt(ts / 1000 / 60 % 60, 10);//计算剩余的分钟数      
            // var ss = parseInt(ts / 1000 % 60, 10);//计算剩余的秒数      
            dd = checkTime(dd);
            // hh = checkTime(hh);
            // mm = checkTime(mm);
            // ss = checkTime(ss);
            // alert(document.getElementById("price1").innerHTML);
            document.getElementById("price").value = '￥' + parseInt(document.getElementById("price1").innerHTML) * parseInt(dd);
            document.getElementById("roomPrice").value = '￥' + parseInt(document.getElementById("price1").innerHTML) * parseInt(dd);
            // document.getElementById("price1").innerText=dd;
            // alert(dd);
            // setInterval("timer()",1000);      //注释此行zhi，不进行倒计时显示
        }

        function checkTime(i) {
            if (i < 10) {
                i = "0" + i;
            }
            return i;
        }
    </script>
     
    <!---/End-date-piker---->
    </div>
</form>
<!--<div class="footer">-->
<!--<p>Copyright © Luxury Hotel Booking. All Rights Reserved | Design by <a href="http://xmoban.cn" target="_blank">xmoban.cn</a></p>-->
<!--</div>-->
</body>
</html>